<%@page import="java.time.LocalDateTime"%>
<%@page import="java.util.Date"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>

	<head>
		<base href="<%=request.getContextPath()%>/">
		<title></title>
		<link rel="stylesheet" type="text/css" href="Styles/bootstrap.min.css" />
		<link rel="stylesheet" type="text/css" href="Styles/admin-all.css" />
		<script type="text/javascript" src="Scripts/jquery-1.7.2.js"></script>
		<script type="text/javascript" src="Scripts/jquery-ui-1.8.22.custom.min.js"></script>
		<link rel="stylesheet" type="text/css" href="Styles/ui-lightness/jquery-ui-1.8.22.custom.css" />
		<script type="text/javascript" src="Scripts/tip.js"></script>
		 <script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/echarts/echarts-all-3.js"></script>
	</head>
	<body>
		<div class="alert alert-info">当前位置<b class="tip"></b>绩效管理<b class="tip"></b>绩效得分</div>
		<table class="table table-striped table-bordered table-condensed">
		<tr>
			<td>查询月份</td>
			<td>
				<select id="sel">
					<option value="请选择" selected="selected">请选择</option>
					<option value="1">1</option>
					<option value="2">2</option>
					<option value="3">3</option>
					<option value="4">4</option>
					<option value="5">5</option>
					<option value="6">6</option>
					<option value="7">7</option>
					<option value="8">8</option>
					<option value="9">9</option>
					<option value="10">10</option>
					<option value="11">11</option>
					<option value="12">12</option>
				</select>
			</td>
		</tr>
		</table>
		<div id="main" style="width: 600px;height:400px;"></div>
	</body>
</html>
<script type="text/javascript">
	$(function(){
		var aaa=[];
		var bbb=[];
		$("#sel").change(function(){
			aaa=[];
			bbb=[];
			$.post("assess/score",{
				month:$("#sel").val()
			},function(data){
				$.each(data,function (index,obj) {
	                aaa[index]= obj.name;
	                bbb[index]= obj.score;
	            })
	            show();
			})
		})
	

	
		
		function show(){
				var myChart = echarts.init(document.getElementById('main'));
				 var option = {
						    color: ['#3398DB'],
						    tooltip : {
						        trigger: 'axis',
						        axisPointer : {            // 坐标轴指示器，坐标轴触发有效
						            type : 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
						        }
						    },
						    grid: {
						        left: '3%',
						        right: '4%',
						        bottom: '3%',
						        containLabel: true
						    },
						    xAxis : [
						        {
						            type : 'category',
						            data : aaa,
						            axisTick: {
						                alignWithLabel: true
						            }
						        }
						    ],
						    yAxis : [
						        {
						            type : 'value'
						        }
						    ],
						    series : [
						        {
						            name:'绩效得分',
						            type:'bar',
						            barWidth: '60%',
						            data:bbb
						        }
						    ]
						};
						    myChart.setOption(option);
		}
	})

</script>
